<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <script src="./vue.global.js"></script>
    <link rel="stylesheet" href="./index.css" />
    <link rel="stylesheet" href="./table.css" />
    <link rel="stylesheet" href="./pugong.css" />
    <link rel="stylesheet" href="./utils.css" />
    <script src="./index.full.js"></script>

    <script>
      //适配代码
      (function (doc, win) {
        var docEI = doc.documentElement,
          resizeEvt = "orientationchange" in window ? "orientataionchange" : "resize",
          recalc = function () {
            var clientWidth = docEI.clientWidth;
            if (!clientWidth) return;
            //100是字体大小，1536是开发时浏览器窗口的宽度，等比计算
            docEI.style.fontSize = 100 * (clientWidth / 1536) + "px";
          };

        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener("DOMContentLoaded", recalc, false);
      })(document, window);
    </script>
    <style>
      * {
        /* margin: 0;
        padding: 0; */
        font-size: 0.25rem;
      }

      .fontw {
        font-weight: 700;
      }
    </style>
  </head>

  <body>
    <div id="app" class="table-content text-left">
      <div class="text-center fontw" style="font-size: 0.25rem; margin-bottom: 50px">安全生产责任书</div>

      <div style="font-size: 16px; margin-bottom: 100px">
        <div class="text-indent mb-20">为了贯彻“安全第一，预防为主，综合治理”的安全生产方针，促使劳动者遵章守纪，减少轻伤，杜绝重伤和死亡事故，确保本项目部安全总目标的实现，特订立如下安全生产责任书：</div>
        <div class="text-indent mb-20">1、入场工人必须严格遵守国家及地方性的法律法规，遵守项目部各项安全生产规章制度及入场须知，操作规程。</div>
        <div class="text-indent mb-20">2、凡参加施工者，必须认真接受项目部三级安全教育，签订安全生产责任书，并积极参加施工前班前安全教育。</div>
        <div class="text-indent mb-20">3、上岗操作必须按规定穿戴好劳动保护用品，正确使用和保管各种防护用品和消防器材，爱护防护设施，故意损坏的用具按价赔偿。</div>
        <div class="text-indent mb-20">4、精心操作并严格执行工艺纪律和操作纪律，做好各项生产记录，严禁在岗位做违反劳动纪律的事情，严格执行交接班制度，交接班必须交接安全情况，交班为接班创造良好的安全生产条件。</div>
        <div class="text-indent mb-20">5、正确分析、判断和处理各种事故苗头，把事故消灭在萌芽状态，对他人违章操作加以劝阻和制止。如发生事故要果断正确处理，及时如实地向上级报告，并保护好现场做好详细记录。</div>
        <div class="text-indent mb-20">6、注重自身形象，文明施工，在生产劳动过程中遵守劳动纪律和安全生产条例，在业余时间内严禁赌博，打架斗殴。如人为造成事故，损坏设备，后果自负，按价赔偿，并负责受害者的医药费及其养伤期间的工资，另外项目部将视情节轻重处以相应罚款。</div>
        <div class="text-indent mb-20">7、作息时间严禁大声喧哗和打闹，如有偷盗，滋事打架，斗殴，聚众闹事等不法行为，立即开除出工地，情节严重的报送公安机关处罚。</div>
        <div class="text-indent mb-20">8、认真执行岗位责任制，加强检查及时发现和消除事故隐患，自己不能处理的应立即上报。有权拒绝一切违章作业指令，可越级向上汇报。</div>
        <div class="text-indent mb-20">9、正确使用和维护机器设备、工具及其他防护用品，保持作业环境整洁，搞好文明生产。乙方须做好自身的安全防护工作，如因乙方不听指挥、工作违章、办私事或自身原因造成的安全、交通等一切事故而引起的伤、残，由乙方负主要责任。</div>
        <div class="text-indent mb-20">10、积极参加各种安全活动，提出有关安全生产的合理化建议。</div>
        <div class="text-indent mb-20">11、本协议未尽事宜，双方协商解决；协商未果的，按国家相关法律法规处理。</div>
        <div class="text-indent mb-20">12、本协议自双方签字之日起生效，至乙方结束在甲方单位的工作起失效。</div>
      </div>

      <div class="d-flex flex-row mt-2 justify-content-between" style="margin-bottom: 50px">
        <div class="flex">
          <div>项目代表（甲方签字）：</div>
          <el-image v-show="dutyForm.projectSign" class="sign_img" :src="dutyForm.projectSign" fit="fill"></el-image>
        </div>
        <div>
          <el-input v-model="dutyForm.pyear" class="people-input" placeholder=" " style="width: 0.8rem"></el-input>
          年
          <el-input v-model="dutyForm.pmonth" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
          月
          <el-input v-model="dutyForm.pday" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
          日
        </div>
      </div>

      <div class="d-flex flex-row mt-2 justify-content-between">
        <div class="flex">
          <div @click="setUpEquipment('dutyForm.constructorSing','TaskSignFinger')">施工人员（乙方签字）：</div>
          <el-image v-show="dutyForm.constructorSing" class="sign_img" :src="dutyForm.constructorSing" fit="fill"></el-image>
        </div>
        <div>
          <el-input v-model="dutyForm.cyear" class="people-input" placeholder=" " style="width: 0.8rem"></el-input>
          年
          <el-input v-model="dutyForm.cmonth" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
          月
          <el-input v-model="dutyForm.cday" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
          日
        </div>
      </div>
    </div>
    <script>
      const { createApp, reactive, toRefs, ref, onMounted } = Vue;
      const vue3Composition = {
        setup() {
          const dutyForm = ref({
            pyear: "",
            pmonth: "",
            pday: "",
            projectSign: "", //甲方
            cyear: "",
            cmonth: "",
            cday: "",
            constructorSing: "", // 乙方
          });

          window.setSign = (event) => {
            console.log(event, "event22");
            dutyForm.value[event.key] = event.img;
          };

          window.getData = (event) => {
            return dutyForm.value;
          };
          window.setData = (data) => {
            dutyForm.value.pyear = data.year;
            dutyForm.value.pmonth = data.month;
            dutyForm.value.pday = data.day;
            dutyForm.value.cyear = data.year;
            dutyForm.value.cmonth = data.month;
            dutyForm.value.cday = data.day;
            dutyForm.value.projectSign =
              "";
          };

          //peopleForm.sign
          const setUpEquipment = (key, type) => {
            window.parent.childListener({
              key,
              type,
            });
          };
          return {
            dutyForm,
            setUpEquipment,
          };
        },
      };
      const app = createApp(vue3Composition).use(ElementPlus).mount("#app");
    </script>
  </body>
</html>
